import React, { useState, useEffect } from 'react'
import { Table, Pagination, ConfigProvider, Spin } from 'antd';
import zhCN from 'antd/lib/locale/zh_CN';
import './index.scss'
const tableParams = {
    tableHeight: 'calc(100vh - 250px)',
    pagination: {
        pageSize: 10,
        pageCurrent: 1
    }
}
export default function BasicTable(props) {
    // 分页数据发生改变触发
    function onChange(pageCurrent, pageSize) {
        
        tableParams.pagination.pageSize = pageSize
        tableParams.pagination.pageCurrent = pageCurrent
        props.event && props.event()
    }
    return (
        <>
            <Spin spinning={props.loading} delay={500} tip="拼命加载中,请稍后..." size="large">
                <Table
                    columns={props.columns}
                    dataSource={props.data}
                    bordered
                    pagination={{
                        position: ['none', 'none'],
                    }}
                    style={{ height: (props.tableHeight ? props.tableHeight : tableParams.tableHeight) }}
                    scroll={{
                        x: 1300,
                    }}
                />
                <ConfigProvider locale={zhCN}>
                    <Pagination
                        total={85}
                        defaultPageSize={tableParams.pagination.pageSize}
                        defaultCurrent={tableParams.pagination.pageCurrent}
                        style={{ display: 'flex', justifyContent: 'right', marginTop: '30px' }}
                        showTotal={(total) => `总共 ${total} 条`}
                        onChange={onChange}
                    />
                </ConfigProvider>
            </Spin>
        </>
    )
}